<template>
	<view class="Global">
		<!-- <image class="imagepage" src="/static/background@2x.png" mode=""></image> -->
		<bgImage></bgImage>
		<MyNav :title="title" bgColor="" :backIcon="isback"></MyNav>


		<scroll-view scroll-y="true" class="ContentScroll" :style="'height:'+scrollViewHeight+'px'">
			<view class="ContentScrollContent">
				<view class="ContentScrollInner">

					<view class="listContent" v-for="(item,index) in listData">




						<view class="contentItem" v-if="item.type==0">

							<view class="contentItemTextLeftContent">
								<text class="contentItemTextLeft">{{item.title}}</text>
								<text class="contentItemTextLeftStart">*</text>
							</view>
              <text class="contentItemTextRight">{{item.Value}}</text>
						</view>


						<view class="contentItem2" v-if="item.type==1">

							<view class="contentItemTextLeftContent">
								<text class="contentItemTextLeft">{{item.title}}</text>
								<text class="contentItemTextLeftStart">*</text>
							</view>
							<input class="contentItemTextRight" @input="onInputAccount(index,$event)" type="text" :value="item.Value" />

						</view>



						<view class="contentItem2" v-if="item.type==2">

							<view class="contentItemTextLeftContent">
								<text class="contentItemTextLeft">{{item.title}}</text>
								<text class="contentItemTextLeftStart">*</text>
							</view>

							<view class="contentItemRightContent">
								<text class="contentItemTextLeft">{{item.Value}}</text>
								<image class="contentItemRightContentImg" src="/static/gongzuotai/xia_jiantou@2x.png" @click="selectOrder()"
									mode="">
								</image>
							</view>

						</view>
            <view class="contentItem2" v-if="item.type==3">

              <view class="contentItemTextLeftContent">
                <text class="contentItemTextLeft">{{item.title}}</text>
                <text class="contentItemTextLeftStart">*</text>
              </view>

              <view class="contentItemRightContent">
                <text class="contentItemTextLeft">{{item.Value}}</text>
                <image class="contentItemRightContentImg" src="/static/gongzuotai/xia_jiantou@2x.png"
                       mode="">
                </image>
              </view>

            </view>
            <view class="contentItem2" v-if="item.type==4">

              <view class="contentItemTextLeftContent">
                <text class="contentItemTextLeft">{{item.title}}</text>
                <text class="contentItemTextLeftStart">*</text>
              </view>

              <view class="contentItemRightContent">
                <text class="contentItemTextLeft" @click="updateData()">{{item.Value}}</text>
                <image class="contentItemRightContentImg" src="/static/gongzuotai/xia_jiantou@2x.png" @click="updateData()"
                       mode="">
                </image>
              </view>

            </view>
            <view class="contentItem" v-if="item.type==5">

              <view class="contentItemTextLeftContent">
                <text class="contentItemTextLeft">{{item.title}}</text>
                <text class="contentItemTextLeftStart">*</text>
              </view>
              <text class="contentItemTextRight" @click="selectUser()">{{item.Value}}</text>
              <image class="contentItemRightContentImg" src="/static/gongzuotai/xia_jiantou@2x.png" @click="selectUser()"
                     mode="">
              </image>
            </view>
						<view class="lineBg"></view>

					</view>


					<checkbox-group class="contentSizeTopCheckbox" name="contentSizeTopCheck">
						<label>
							<checkbox style="transform:scale(0.7)" value="" /><text
								class="contentSizeTopText1">扎号入菲</text>
						</label>

					</checkbox-group>


					<view class="historyContent">
						<text class="historyContentText">历史记录</text>
					</view>


				</view>

			</view>

			<view class="loginContent">

				<button @click="createOrder()" style="color:#ffffff" class="login" type="default">{{login}}</button>
			</view>


		</scroll-view>




	</view>
</template>

<script>
	import MyNav from '@/components/customnavbar.vue'
	import bgImage from '@/components/backgroundImage.vue'
  import {addOrderRegister} from "@/pages/api/api";

	export default {
		components: {
			MyNav,
			bgImage
		},
		data() {
			return {
				login: '确定入菲',

				title: '手工入菲',

				isback: true,

				listData: [{
						title: '工号',
						Value: '请选择',
						type: 5
					},
					{
						title: '订单',
						Value: '请选择',
						type: 2
					},
          {
            title: '扎号',
            Value: '请选择',
            type: 3
          },
          {
            title: '款式',
            Value: '',
            type: 0
          },
          {
            title: '颜色',
            Value: '',
            type: 0
          },
          {
            title: '尺码',
            Value: '',
            type: 0
          },
					{
						title: '工序',
						Value: '请选择',
						type: 4
					},
          {
						title: '数量',
						Value: '请输入',
						type: 1
					},
          // {
					// 	title: '日期',
					// 	Value: '请选择',
					// 	type: 2
					// }
				],
				scrollViewHeight: 0,
        processData: [],
        processDataNames: '',
        processDataIds: [],
        orderId: '',
        orderData: {},
        userId: '',
        userData: {},
        splittUpId: '',
        splittUpData: {},
        storeId: '',
        tenantId: '',
			}
		},
    onShow() {
      var that = this
      uni.$on('globleProcessEvent', function(res) {
        // console.log('3422222', res.listSizeData) //  为 B 页面传过来的值
        that.processData = res.listData
        console.log('选择工序返回数据', that.processData) //  为 B 页面传过来的值
        let names = []
        let processDataIds = []
        that.processData.forEach(item=>{
          names.push(item.processName)
          processDataIds.push(item.id);
        })
        that.processDataIds = processDataIds.join(",")
        that.listData.forEach(item=>{
          if(item.title=='工序'){
            item.Value = names.join(",")
          }
        })
        // 移除监听事件
        uni.$off('globleProcessEvent');
      })
      uni.$on('globleOrderListEvent',function (res) {
        that.orderData = res.listDataOne
        that.orderId = res.listDataOne.id
        console.log('选择订单返回数据', that.orderData) //  为 B 页面传过来的值
        that.listData.forEach(item=>{
          if(item.title=='订单'){
            item.Value = res.listDataOne.orderCode
          }
          if(item.title=='款式'){
            item.Value = res.listDataOne.styleName
          }
        })
        // 移除监听事件
        uni.$off('globleOrderListEvent');
      })
      uni.$on('globleUserListEvent',function (res) {
        that.userData = res.listDataOne
        that.userId = res.listDataOne.userId
        console.log('选择订单返回数据', that.userData) //  为 B 页面传过来的值
        that.listData.forEach(item=>{
          if(item.title=='工号'){
            item.Value = that.userData.userName + ' '+that.userData.nickName
          }
        })
        // 移除监听事件
        uni.$off('globleUserListEvent');
      })
      uni.$on('globleOrderSplittUpListEvent',function (res) {
        that.splittUpData = res.listDataOne
        that.splittUpId = res.listDataOne.id
        console.log('选择订单返回数据', that.splittUpData) //  为 B 页面传过来的值
        that.listData.forEach(item=>{
          if(item.title=='扎号'){
            item.Value = that.splittUpData.bundleCode
          }
          if(item.title=='颜色'){
            item.Value = that.splittUpData.colors
          }
          if(item.title=='尺码'){
            item.Value = that.splittUpData.sizes
          }
        })
        // 移除监听事件
        uni.$off('globleOrderSplittUpListEvent');
      })
    },
		onLoad() {
			// 在其他页面或组件中访问
      const app = getApp();
      this.storeId = app.globalData.storeId
      this.tenantId = app.globalData.tenantId

			this.scrollViewHeight = app.globalData.scrollViewHeight2
		},
		methods: {
      // 获取编号输入框的值
      onInputAccount(index,e) {
        this.listData[index].Value=e.target.value
      },

			// 确定入菲
			createOrder() {
        let data = {
          userId: this.userId,
          orderId: this.orderId,
          splittUpId: this.splittUpId,
          bundleCode: this.splittUpData.bundleCode,
          quantity: 0,
          processIds: this.processDataIds,
          storeId: this.storeId,
          tenantId: this.tenantId,
        }
        this.listData.forEach(item=>{
          if(item.title=='数量'){
            data.quantity = item.Value
          }
        })
        addOrderRegister(data).then(res=> {
          if (res.code == 200) {
            let data = res.data
            // 显示提示信息
            uni.showToast({
              title: res.msg,
              icon: 'none'
            });
            uni.navigateTo({
              url: '/subPack/workInThePhilippines/reportWorkResult/reportWorkResult',
              success: res => {},
              fail: () => {},
              complete: () => {}
            });
          }
        })

			},
      // 选择工序
      updateData() {
        console.log('updateData')
        let parmas = {
          storeId: this.storeId,
          tenantId: this.tenantId,
          orderId: this.orderId,
          selectList: []
        }
        uni.navigateTo({
          url: '/subPack/workInThePhilippines/workInThePhilippines/orderProcessSelect/orderProcessSelect?data=' +
              encodeURIComponent(JSON.stringify(parmas)),
          success: res => {
          },
          fail: () => {
          },
          complete: () => {
          }
        });
      },
      selectOrder(){
        let parmas = {
          storeId: this.storeId,
          tenantId: this.tenantId,
        }
        uni.navigateTo({
          url: '/subPack/workInThePhilippines/components/orderListSelect?data='+encodeURIComponent(JSON.stringify(parmas)),
          success: res => {
          },
          fail: () => {
          },
          complete: () => {
          }
        });
      },
      selectUser(){
        let parmas = {
          storeId: this.storeId,
          tenantId: this.tenantId,
        }
        uni.navigateTo({
          url: '/subPack/workInThePhilippines/components/userListSelect?data='+encodeURIComponent(JSON.stringify(parmas)),
          success: res => {
          },
          fail: () => {
          },
          complete: () => {
          }
        });
      },
		}
	}
</script>

<style>
	.loginContent {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 750rpx;

		margin-top: 30rpx;
	}

	.login {
		display: flex;
		justify-content: center;
		margin-top: 20rpx;
		width: 690rpx;
		height: 100rpx;

		border-radius: 30rpx;
		font-weight: 400;
		font-size: 36rpx;
		color: #FFFFFF;
		text-align: center;
		font-weight: bold;


		background: linear-gradient(90deg, #45A8FF, #0AE1C6);

	}


	.historyContentText {

		display: flex;
		align-items: center;
		justify-content: center;

		font-family: HarmonyOS Sans SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #333333;
		line-height: 30rpx;
	}

	.historyContent {
		width: 630rpx;
		height: 80rpx;
		background: #ECF5FD;
		border-radius: 20rpx;

		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 30rpx;
		margin-bottom: 30rpx;

	}

	.contentSizeTopText1 {

		font-family: HarmonyOS Sans SC;
		font-weight: bold;
		font-size: 24rpx;
		color: #333333;
	}

	.contentSizeTopCheckbox {

		display: flex;
		justify-content: left;
		align-items: center;

		margin-top: 10rpx;
		width: 100%;
		height: 120rpx;


	}

	.contentItemTextRight {
		font-size: 28rpx;
		font-weight: 600;
		color: #666666;
		margin-right: 30rpx;
		width: 200rpx;
		text-align: right;
	}

	.contentItemTextLeftStart {
		color: red;
	}

	.contentItemRightContentImg {
		width: 20rpx;
		height: 10rpx;
		margin-left: 15rpx;
		margin-right: 15rpx;

	}

	.contentItemTextLeft {
		font-size: 28rpx;
		font-weight: 600;
		color: black;
		margin-left: 30rpx;
	}

	.contentItem2 {
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: row;

		width: 690rpx;
		height: 120rpx;


		/* background-color: aqua; */
	}



	.contentItemRightContent {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}


	.contentItemTextLeftContent {

		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}

	.contentItem {

		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: row;

		width: 690rpx;
		height: 120rpx;

		border-radius: 30rpx 30rpx 0 0;
		/* background-color: aqua; */

	}


	.contentItem4 {
		margin-left: 20rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		/* background-color: bisque; */
	}

	.labelContent {
		font-size: 20rpx;
		font-weight: 600;
	}

	.contentItem3 {
		display: flex;
		align-items: center;
		flex-direction: row;
		justify-content: space-evenly;
		width: 100%;
		height: 120rpx;

	}

	.listContent {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		width: 690rpx;



	}

	.lineBg {
		width: 100%;
		height: 1rpx;
		background: #F9FCFF;
	}

	.ContentScroll {

		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;


		width: 750rpx;

		height: 1000rpx;

		border-radius: 30rpx;
	}

	.ContentScrollContent {

		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;


	}

	.ContentScrollInner {

		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;


		width: 690rpx;

		border-radius: 30rpx;
		background: #FFFFFF;


	}


	.imagepage {

		background-size: cover;
		background-repeat: no-repeat;
		background-position: center center;
		position: absolute;
		z-index: -1;
		left: 0;
		right: 0;
		bottom: 0;
		right: 0;
		width: 100%;
		height: 100%;

	}
</style>
